/* 
	该文件是对axios的二次封装，封装目的是：
			1.让所有请求都有一个进度条的效果
			2.让所有请求自动返回的就是response.data
*/

import axios from 'axios'
import nprogress from 'nprogress'
import store from '@/store'
import 'nprogress/nprogress.css'

const myAxios = axios.create({
	baseURL:'/api',
	timeout:5000, //超时时间
})

// 请求拦截器
myAxios.interceptors.request.use((config)=>{
	nprogress.start() //进度条开始走

	// 携带用户临时标识
	let userTempId = store.state.user.userTempId;
	if (userTempId) {
		// 请求头携带用户临时标识的时候,请求头当中的字段,必须是 "userTempId"
		// 大小写不能错,为什么? 后端规定
		config.headers.userTempId = userTempId;
	}

	let token = store.state.user.token;
	if (token) {
		// 请求头当中必须叫token
		config.headers.token = token;
	}

	return config
})

// 响应拦截器
myAxios.interceptors.response.use(
	//响应成功的回调
	response => {
		//进度条停下来
		nprogress.done()
		//把服务器返回真正数据交给使用者，使用者就不用.data了
		return response.data 
	},
	//响应失败的回调
	error => {
		//进度条停下来
		nprogress.done()

		// 第一种做法，将响应的错误继续传递下去，可以触发程序员发请求时的失败回调。
		// return Promise.reject(error)

		/* 
			第二种做法，提示一下错误，然后返回一个pendding状态的Promise实例，
			这样就不会触发程序员发请求时的失败回调了 
		*/
		alert(error)
		// return new Promise(()=>{})
		// 什么时候会走到错误的回调,当http请求失败的,例如http响应报文携带的是404code码返回的时候
		// 这里return了一个pending状态的promise
		// 问:后续再调用接口的时候,或报错吗?
		// 后续这里的错误不会继续往后抛,后续再actions或者页面调用接口的时候
		// 截获不到这个错信信息了,
		// 这样做不对,响应拦截器中可以做统一的错误处理(无可厚非)
		// 但是后续如果想要根据错误去写一些逻辑的时候,
		// 后续拿不到错误信息,这就是问题
		// 这里需要改,改成return 一个失败的promise即可
		return Promise.reject(error)
	}
)

export default myAxios
